<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <h1></h1>
</body>
<script>
  let obj = {
    username: "张三",
    age: 21
  }

  let h1=document.querySelector("h1")
  h1.textContent=obj.username

  Object.defineProperty(obj,"username",{
    // value:"李四",          //修改值
    // writable:false,         //是否可写(不可以和set()一起使用)
    enumerable:false,        //不可枚举(for in)
    configurable:false,      //是否可删除
    get(a,b,c){
      console.log(a,b,c)
      console.log("---getter----")

    },
    set(val){
      h1.textContent=val
      // console.log("----setter-----")

    }
  })
  obj.username

  // obj.username="李四"        //重新复制
  // obj.username             //读操作，会进入getter
  // delete obj.username      //删除属性，需要configurable为true

  // obj.username="李四"      //重新赋值

  //遍历属性值，需要设置enumerable为true
  // for(i in obj){
  //   console.log(i)
  // }


</script>

</html>